<!DOCTYPE html>
<html>
<head>
	<% include ../link %>
</head>
<body>
	<% include ../head %>
	<div class="row">
		<div class="col-md-8">
			<ul class="nav nav-pills" role="tablist">
				<li role="presentation"><a href="/admin/video">视频管理</a></li>
				<li role="presentation"><a href="/admin/article">文章管理</a></li>
				<li role="presentation" class="active">
					<div class="btn-group">
						<button style="background-color: #378BDE;" type="button" class="button button-primary button-rounded button-action" data-toggle="dropdown">
						用户管理 <span class="caret"></span>
						</button>
						<ul class="dropdown-menu" role="menu">
							<li title="管理员的黑色小本本"><a href="/admin/users?seal=seal">黑色小本本</a></li>
							<li title="咸鱼名单"><a href="/admin/users?seal=unseal">咸鱼名单</a></li>
							<li><a href="#">more</a></li>
						</ul>
					</div>
 				</li>
 				<li role="presentation"><a href="/admin/add">添加管理员</a></li>
			</ul>
		</div>
		<div class="col-md-2">
			<input class="seid form-control" type="text" name="id" placeholder="id">
		</div>
		<div class="col-md-1">
			<button class="select button button-action button-rounded button-small">select</button>
		</div>
	</div>
	
	<table class="table table-striped">
		<thead>
			<tr>
				<th>id</th>
				<th>name</th>
				<th>motto</th>
				<th>img</th>
				<th>email</th>
				<th>regTime</th>
				<th>操作</th>
			</tr>
		</thead>
		<tbody data-bind="foreach: users">
			<tr>
				<th data-bind="text: id"></th>
				<th data-bind="text: name"></th>
				<th data-bind="text: motto"></th>
				<th data-bind="text: img"></th>
				<th data-bind="text: email"></th>
				<th data-bind="text: regTime"></th>
				<th>
					<button data-bind="text: btTxt, attr: {title : id, value : seal}" class="seal button button-caution button-rounded button-small">seal</button>
				</th>
			</tr>
		</tbody>
	</table>
</body>
<script type="text/javascript">

	var users = '<%- JSON.stringify(users)%>'
	users = JSON.parse(users)
	console.log(users)

	function getTime(time){
		time = parseInt(time);
		time = new Date(time).format("yyyy-MM-dd hh:ss");
		return time;
	}

	function judgeSealStatus(seal){
		if (seal) {
			return '解除';
		} else {
			return '记上';
		}
	}

	function ViewModel(){
		var self = this
		self.users = ko.observableArray()
	}

	var vm = new ViewModel();

	function usersModel(u){
		var self = this;
		self.id = u._id;
		self.name = u.name;
		self.motto = u.motto;
		self.img = u.headImgUrl;
		self.email = u.email;
		self.regTime = getTime(u.regTime);
		self.seal = u.seal;
		self.btTxt = judgeSealStatus(u.seal);
	}


	users.forEach(function(value, index){
		vm.users.push(new usersModel(value))
	})

	ko.applyBindings(vm)

	var sealBtn = $('.seal');
	sealBtn.on('click', function(){
		var seal = $(this).val()
		if (seal) {
			var url = '/admin/users?seal=unseal'
			sealAjax(url, $(this), $(this).attr('title'));
		} else {
			var url = '/admin/users?seal=seal'
			sealAjax(url, $(this), $(this).attr('title'));
		}
	})

	function sealAjax(url, btn, id, st){
		$.ajax({
			type:'put',
			url:url,
			data:{
				'id':id
			},
			success:function(data){
				Messenger().post({
					message:data.dt,
					hideAfter:1
				})
				btn.parent().parent().remove()
			}
		})
	}

	var selectBtn = $('.select');
	selectBtn.on('click',function(){
		if ($('.seid').val()!='') {
			var id = $('.seid').val();
			$.ajax({
				url:'/admin/selectUserone',
				type:'get',
				data:{
					'id':id
				},
				success:function(data){
					vm.users.push(new usersModel(data))
				}
			})
		} else {

		}
	})
</script>
</html>